/**
 * Created by shaoting on 16/10/17.
 */
import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    ListView,
    Image,
    TouchableOpacity,
    Platform,
    Dimensions,
    AsyncStorage
} from 'react-native';
var NetUitl = require('../Main/NXFetch');
var {width,height} = Dimensions.get('window').height; //屏宽
var DetailsTopView = React.createClass({
    getInitialState(){
        return {
            product_id:'',
            uploadImgId:''
        }
    },
    componentDidMount(){
        // alert(this.props.product_id)
        var token = '';
        try {
            AsyncStorage.getItem(
                'token',
                (error,result)=>{
                    if (error){
                        alert('取值失败:'+error);
                    }else{
                        // alert('取值成功:'+result);
                        this.token = result
                    }
                }
            )
        }catch(error){
            alert('失败'+error);
        }
        let formData = new FormData();
        formData.append("product_id", this.props.product_id);
        formData.append("uploadImgId", this.props.uploadImgId);
        var fetchOptions = {
            method: 'POST',
            headers: {
                'token': this.token
            },
            body:formData,
        };

        let url = 'http://www.pintasty.cn/productdetail/findproductdetailbyid';
        fetch(url, fetchOptions)
            .then((response) => response.json())
            .then((json) => {
                console.log(json)
                if(json.status == 200){
                    this.setState({
                        shotName:json.data.shotName,
                        productName:json.data.productName,
                        bigPicture:json.data.bigPicture,
                        isCollect:json.data.isCollect
                    })
                }else  if (json.status == 301){
                    // alert('没有token')
                }else {
                    alert('访问服务器失败了')
                }
            }) .done();
    },
    getInitialState(){
        // 初始化数据源
        return {
            shotName: '',
            productName:'',
            bigPicture:'head_default_img',
            isCollect:'',
        }
    },
    render() {
        return (
            <View>
                <Image source={{uri:this.state.bigPicture}} style={{width:width,height:350}}/>
                <View  style={{flexDirection:'row'}}>
                    <Image source={{uri:this.state.bigPicture}} style={{top:-40,left:20,marginRight:30,width:120,height:150}}/>
                    <View style={{position:'absolute',right:42,left:150}}>
                        <Text style={{fontSize:18,marginTop:10,color:'rgba(200,200,200,1.0)'}}>{this.state.shotName}</Text>
                        <Text style={styles.textStyle}>{this.state.productName}</Text>
                        <Image source={{uri:'guoqi'}} style={{width:20,height:20}}/>
                    </View>
                    <View style={{position:'absolute',flexDirection:'row',marginTop:30,right:10}}>
                        <View style={{width: 1,height:40,backgroundColor:'rgba(200,200,200,1.0)'}}></View>
                        <TouchableOpacity onPress={this.collectAction}>
                            <Image source={{uri:this.state.isCollect == '0'?'h_Hearts_icon':'hearts_icon'}} style={{width:25,height:22,marginTop:10,marginLeft:5}}/>
                        </TouchableOpacity>
                    </View>
                </View>
                <View style={{width:width ,height: 3,backgroundColor:'rgba(200,200,200,1.0)',top:-38}}></View>
            </View>
        );
    },
    collectAction(){
        let formData = new FormData();
        formData.append("product_id", this.props.product_id);
        formData.append("uploadImageId", this.props.uploadImgId);
        var collect = ''
        if (this.state.isCollect == '0'){
            collect = '1'
        }else{
            collect = '0'
        }
        formData.append("collect", collect);

        var token = '';
        try {
            AsyncStorage.getItem(
                'token',
                (error,result)=>{
                    if (error){
                        alert('取值失败:'+error);
                    }else{
                        // alert('取值成功:'+result);
                        this.token = result
                    }
                }
            )
        }catch(error){
            alert('失败'+error);
        }
        var fetchOptions = {
            method: 'POST',
            headers: {
                'token': this.token
            },
            body:formData,
        };

        let url = 'http://www.pintasty.cn/productdetail/collect';
        fetch(url, fetchOptions)
            .then((response) => response.json())
            .then((json) => {
                console.log(json)
                if(json.status == 200){
                    this.setState({
                        isCollect:!this.state.isCollect
                    })
                }else  if (json.status == 301){
                    // alert('没有token')
                }else {
                    // alert('访问服务器失败')
                }
            }) .done();

    }
});


var styles = StyleSheet.create({
    textStyle:{
        fontSize:20,
        marginBottom:20,
    }
});

module.exports = DetailsTopView;